<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
	<link rel="stylesheet" type="text/css" href="../../css/api.css" />
	<link rel="stylesheet" type="text/css" href="../../css/common.css" />
	<link rel="stylesheet" type="text/css" href="../../css/aui.css" />
  <title>学术</title>
  <style>
		html, body {width: 100%;min-height: 100%;background: #fff;}
    .fbxq {
      padding: 0 1rem;
      font-size: 0.7rem;
      color: #999;
    }
    .fbxq > div {
      line-height: 2.2rem;
      height: 2.2rem;
      position: relative;
    }
    .fbxq > div span {
      vertical-align:top;
    }
    .fbxq > div.h20 {height: 1rem;line-height: 1rem;background: #f0f0f0;margin: 0.5rem -1rem}
    .fbxq input[type="text"] {
      width: 60%;
      font-size: 0.7rem;
      color: #333;
      border: none;
      display: inline-block;
      padding-left: 1rem;
      position: relative;

    }
    .fbxq > div .input_date_outer {
      width: 100%;
      color: #999;
      border: none;
      display: inline-block;
      left: 0;
      top:0;
      position: absolute;
      height: 2.2rem;
    }
    .fbxq input[type="date"] {
        width: 100%;
        font-size: 0.6rem;
         line-height: 2.2rem;
    }
    .fbxq span.aui-list-item-arrow {
      position: relative;
      padding-right: 0.5rem;
    margin-top: 1rem;
    float: right;
    }
    .fbxq span.aui-list-item-arrow:before {
      right: 0;
    }
    .fbxq  > div.upload {
      margin-top: 0.5rem;
      line-height: auto;
      height: auto;
    }
    .fbxq  > div.upload::before,
    .fbxq  > div.upload::after {
        content: '';
        display: block;
        height: 0;
        clear: both;
    }
    .fbxq  > div.upload .upload_left {
      float: left;
      width: 48%;
    }
    .fbxq  > div.upload .upload_left img {
      width: 100%;
    }
    .fbxq  > div.upload .upload_right {
      height: auto;
      width: 30%;
      position: relative;
      box-sizing: content-box;
      float: right;
    }
    .fbxq .upload_right img {
      width: 100%;
    }
    .fbxq input[type="file"] {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      opacity: 0;
      z-index: 1;
    }
    .fbxq textarea {
      font-size: 0.7rem;
      color: #999;
      width: 100%;
      height: 10rem;
    }

    /* 头部样式 */
    #header_top {
      background: #2997e4;
      padding-top: 25px;
    }
	</style>
</head>
<body>
  <div id="app">
    <header id="header_top" class="aui-bar aui-bar-nav" >

      <a class="aui-pull-left"  onclick="goback()">
          <span class="aui-iconfont aui-icon-left"></span>
      </a>
      <div class="aui-title" id="title">
      认证资料
    </div>
        <a class="aui-pull-right" @click="submit">
            提交
        </a>
    </header>
    <div class="fbxq">
      <div>
        医生姓名<input type="text" placeholder="请输入医生姓名" v-model="doctorname">
      </div>
      <div>
        头衔职称<input type="text" placeholder="请输入头衔职称" v-model="post">
      </div>
      <div>
        身份证号<input type="text" placeholder="请填写身份证号码" v-model="idnumber">
      </div>
      <div>
        所属科室<input type="text" placeholder="请输入所属科室" v-model="desk">
      </div>
      <div>
        擅长领域<input type="text" placeholder="请填写擅长领域" v-model="speciality">
      </div>
      <div>
        所属医院<input type="text" placeholder="请填写所属医院" v-model="hospitalname">
      </div>
      <div class="h20"></div>
      <div>
        <span>从业时间</span>
        <span class="aui-list-item-arrow"></span>
        <div class="input_date_outer" style="display:inline-block;padding-left:3.8rem"><input type="date" v-model="worktime"></div>
      </div>
      <div class="upload">
      <div>上传身份证正面照</div>
        <div class="upload_left">
          <img v-if="identity_picture" :src="identity_picture" alt="">
          <img v-else src="../../image/firstpage/sfz@3x.png" alt="">
        </div>
        <div class="upload_right" @click="showAction(1)">
          <img src="../../image/firstpage/tjtp@3x.png" alt="" >
          <!-- <input type="file" class="file"> -->
        </div>
      </div>
      <div class="upload">
      <div>上传职业资格证书</div>
        <div class="upload_left">
          <img v-if="credentials" :src="credentials" alt="">
          <img v-else src="../../image/firstpage/timg@3x.png" alt="">
        </div>
        <div class="upload_right" @click="showAction(2)">
          <img src="../../image/firstpage/tjtp@3x.png" alt="" >
          <!-- <input type="file" class="file"> -->
        </div>
      </div>
      <div class="h20"></div>
      <div>个人简介</div>
      <textarea placeholder="请简单介绍一下你自己吧~" v-model="introduces"></textarea>
    </div>
</div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/vue.min.js"></script>
<script type="text/javascript" src="../../script/utils.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script type="text/javascript">
function goback () {
  var jsfun = 'window.location.reload()';

  api.execScript({
    name: 'index_jk_rz',
    frameName: 'index_jk_rz',
    script: jsfun
});
  api.closeWin({name:api.pageParam.name});
}
// 完成首页初始化
apiready = function(){
  var type = api.pageParam.name;

	var app = new Vue({
		el: '#app',
		data: {
      token:'',
      doctorname: '', //  医生姓名
      desk: '', //  所属科室
      post: '', // 职称
      idnumber: '', // 身份证号
      worktime: '', // 从业日期
      speciality: '', // 擅长领域
      identity_picture: '', // 身份证照
      credentials: '', // 资格证书
      introduces: '', // 医生简介
      hospitalname: '', // 所属医院
		},
		created: function() {
      var $_this = this
      $_this.token = $api.getStorage('token')
      // if (!$_this.token) {
      //   alert('用户未登录，请返回登录')
      //   goback()
      // }
		},
    methods: {

      // 上传图片
      showAction: function (cid){
        var $_this = this

        if (cid == 1) {
          var title = '身份证照上传'
        } else if (cid == 2) {
          var title = '资格证书上传'
        }
        api.actionSheet({
            title: title,
            cancelTitle: '取消',
            buttons: ['拍照','从手机相册选择']
        }, function(ret, err) {
            if (ret) {
                $_this.getPicture(ret.buttonIndex, cid);
            }
        });
      },
      getPicture: function (sourceType, cid) {
        var $_this = this
              if(sourceType==1){ // 拍照
                  api.getPicture({
                      sourceType: 'camera',
                      encodingType: 'jpg',
                      mediaValue: 'pic',
                      allowEdit: false,
                      destinationType: 'base64',
                      quality: 90,
                      saveToPhotoAlbum: true
                  }, function(ret, err) {
                      if (ret) {

                        var formData=ret.data;
                        var formData=ret.base64Data;
                        api.ajax({
                            method:"post",
                            url:window.Url.addPicture,
                               data: {
                                 files: {file: ret.data}
                               }

                        },function(ret,err){
                            if(ret){
                              if(ret.error == '0')
                              {
                                if (cid == 1) {
                                  $_this.identity_picture = ret.url
                                } else if (cid == 2) {
                                  $_this.credentials = ret.url
                                }

                              }
                              else{
                                api.alert({msg:ret.message});
                              }
                              console.log("图片返回"+JSON.stringify(ret))
                            }else{
                                api.toast({
                                  msg : '你没有选择图片',
                                  location : 'middle'
                                })
                            }
                        })
                      }else {
                          alert(JSON.stringify(err));
                      }
                  });
              }
              else if(sourceType==2){ // 从相机中选择
                  api.getPicture({
                          sourceType: 'album',
                          encodingType: 'png',
                          mediaValue: 'pic',
                          destinationType: 'url',
                          allowEdit:true,
                          quality: 50,
                          saveToPhotoAlbum:false,
                          targetWidth: 750,
                          targetHeight: 750
                      }, function(ret, err) {
                          if (ret) {
                              var formData=ret.data;
                              // $('.img').prop('src',ret.data);
                              var formData=ret.base64Data;
                              api.ajax({
                                  method:"post",
                                  url:window.Url.addPicture,
                                     data: {
                                       files: {file: ret.data}
                                     }

                              },function(ret,err){
                                  if(ret){
                                    if(ret.error == '0')
                                    {
                                      if (cid == 1) {
                                        $_this.identity_picture = ret.url
                                      } else if (cid == 2) {
                                        $_this.credentials = ret.url
                                      }
                                    }
                                    else{
                                      api.alert({msg:ret.message});
                                    }
                                    console.log("图片返回"+JSON.stringify(ret))
                                  }else{
                                      api.toast({
                            						msg : '你没有选择图片',
                            						location : 'middle'
                            					})
                                  }
                              })
                          } else {
                              api.alert({msg:JSON.stringify(err)});
                          }
                  });
              }
          },
      submit: function () {
        var $_this = this
        if ($_this.doctorname == '') {
          api.toast({ msg: '请输入医生姓名',duration: 2000,location:'middle' });
          return
        } else if ($_this.post == '') {
          api.toast({ msg: '请输入头衔职称',duration: 2000,location:'middle' });
          return
        } else if ($_this.idnumber == '') {
          api.toast({ msg: '请填写身份证号码',duration: 2000,location:'middle' });
          return
        } else if ($_this.desk == '') {
          api.toast({ msg: '请输入所属科室',duration: 2000,location:'middle' });
          return
        } else if ($_this.speciality == '') {
          api.toast({ msg: '请填写擅长领域',duration: 2000,location:'middle' });
          return
        } else if ($_this.hospitalname == '') {
          api.toast({ msg: '请填写所属医院',duration: 2000,location:'middle' });
          return
        } else if ($_this.worktime == '') {
          api.toast({ msg: '请选择从业时间',duration: 2000,location:'middle' });
          return
        } else if ($_this.identity_picture == '') {
          api.toast({ msg: '请上传身份证正面照',duration: 2000,location:'middle' });
          return
        } else if ($_this.credentials == '') {
          api.toast({ msg: '请上传职业资格证书',duration: 2000,location:'middle' });
          return
        } else if ($_this.introduces == '') {
          api.toast({ msg: '请简单介绍一下你自己',duration: 2000,location:'middle' });
          return
        }

        api.ajax({
  			  url: window.Url.applyCertification,
  				timeout: 300,
          method: 'post',
          headers: {
            'Content-Type': 'application/json',
            'baseParams': $_this.token //token
          },
          data: {
            body: {
              doctorname: $_this.doctorname, //  医生姓名
              desk: $_this.desk, //  所属科室
              post: $_this.post, // 职称
              id: $_this.id, // 认证信息id
              idnumber: $_this.idnumber, // 身份证号
              worktime: $_this.worktime, // 从业日期
              speciality: $_this.speciality, // 擅长领域
              identity_picture: $_this.identity_picture, // 身份证照
              credentials: $_this.credentials, // 资格证书
              introduces: $_this.introduces, // 医生简介
              hospitalname: $_this.hospitalname, // 所属医院
            }
          },
  			}, function(ret, err) {
  			    if (ret) {
              if (ret.code == 2) {
                  alert('用户未登录，请返回登录')
                  $api.rmStorage('token')
                  $api.rmStorage('data')
                  goback()
                   return
                }else if (ret.code == 0) {
                  api.toast({ msg: '提交成功请等待审核',duration: 2000,location:'middle' });
                  goback()
                } else {
                  api.alert({ msg: JSON.stringify(ret) });
                }


  			    } else {
  			        api.alert({ msg: JSON.stringify(err) });
  			    }
  			})
      }
    }
	})
}
</script>
</html>
